no message

1 files changed, 35 insertions, 4 deletions

diff --git a/src/pages/shop/brands/[slug].js b/src/pages/shop/brands/[slug].js
index 928da0d0..64ff7706 100644
--- a/src/pages/shop/brands/[slug].js
+++ b/src/pages/shop/brands/[slug].js
@@ -6,8 +6,15 @@ import Header from "@/components/layouts/Header";
 import Layout from "@/components/layouts/Layout";
 import Pagination from "@/components/elements/Pagination";
 import ProductCard from "@/components/products/ProductCard";
-import { getNameFromSlug } from "@/core/utils/slug";
+import { getIdFromSlug, getNameFromSlug } from "@/core/utils/slug";
 import FilterIcon from "@/icons/filter.svg";
+import apiOdoo from "@/core/utils/apiOdoo";
+import { Swiper, SwiperSlide } from "swiper/react";
+import "swiper/css";
+import "swiper/css/pagination";
+import "swiper/css/autoplay";
+import { Pagination as SwiperPagination } from "swiper";
+import Image from "@/components/elements/Image";
 
 export async function getServerSideProps(context) {
   const { 
@@ -30,6 +37,8 @@ export async function getServerSideProps(context) {
   ].join('&');
   let searchResults = await axios(`${process.env.SELF_HOST}/api/shop/search?${urlParameter}`);
   searchResults = searchResults.data;
+
+  const manufacture = await apiOdoo('GET', `/api/v1/manufacture/${getIdFromSlug(slug)}`);
   
   return {
     props: { 
@@ -39,7 +48,8 @@ export async function getServerSideProps(context) {
       category, 
       price_from,
       price_to,
-      order_by
+      order_by,
+      manufacture
     }
   };
 }
@@ -51,7 +61,8 @@ export default function BrandDetail({
   category, 
   price_from,
   price_to,
-  order_by
+  order_by,
+  manufacture
 }) {
   const pageCount = Math.ceil(searchResults.response.numFound / searchResults.responseHeader.params.rows);
   const productStart = searchResults.responseHeader.params.start;
@@ -94,8 +105,28 @@ export default function BrandDetail({
         disableFilter={['brand']}
       />
       <Layout>
+        <Swiper slidesPerView={1} pagination={{dynamicBullets: true}} modules={[SwiperPagination]}>
+          {
+            manufacture.banners?.map((banner, index) => (
+              <SwiperSlide key={index}>
+                <Image
+                  src={banner} 
+                  alt={`Banner ${manufacture.name}`} 
+                  className="w-full h-auto"
+                />
+              </SwiperSlide>
+            ))
+          }
+        </Swiper>
         <div className="p-4">
-          <h1 className="mb-2">Produk</h1>
+          <div className="flex">
+            { manufacture.logo ? (
+              <Image src={manufacture?.logo} alt={manufacture.name} className="w-4/12 border border-gray_r-6 rounded p-3" />
+            ) : (
+              <p className="badge-red text-caption-1">Brand { manufacture.name }</p>
+            ) }
+          </div>
+          <h1 className="mb-2 mt-4">Produk</h1>
           <div className="text-caption-1 mb-4">
             {productFound > 0 ? (
               <>